<template>
	<view class="nearby-stores">

		<view class="bac"></view>
		<!-- 搜索框 -->
		<view class="search-box">
			<input type="text" placeholder="输入需要搜索的内容" v-model="searchValue" @confirm="handleSearch" />
			<image src="/static/Maintenance/search.png" mode=""></image>
		</view>

		<!-- 历史记录 -->


		<!-- 门店列表 -->
		<view class="border">
			<view class="intro1">
				<view class="hang1">
					<view>车百事汽车生活馆</view>
					<view>556m</view>
				</view>
				<view class="hang2">
					<view>⭐⭐⭐⭐</view>
					<view>4分</view>
					<view>销量：556</view>
				</view>
				<view class="detail">
					<view class="left">
						<image src="/static/Maintenance/store.png" mode=""></image>
					</view>
					<view class="right">
						<view>营业时间：周一至周五</view>
						<view>早上8:00----晚上22:00</view>
						<view>山阳区人民路与解放路交叉口</view>
					</view>
				</view>


			</view>
		
			<view class="intro2">
					<view class="hang1">
						<view>车百事汽车生活馆</view>
						<view>556m</view>
					</view>
					<view class="hang2">
						<view>⭐⭐⭐⭐</view>
						<view>4分</view>
						<view>销量：556</view>
					</view>
					<view class="detail">
						<view class="left">
							<image src="/static/Maintenance/store.png" mode=""></image>
						</view>
						<view class="right">
							<view>营业时间：周一至周五</view>
							<view>早上8:00----晚上22:00</view>
							<view>山阳区人民路与解放路交叉口</view>
						</view>
					</view>
			
			
				</view>
			
		</view>


		<!-- 暂无更多 -->
		<view class="more">— 暂无更多 —</view>
		
		
	</view>
</template>

<script setup>

</script>

<style scoped>
	.bac {
		background-color: #2b85e4;
		height: 300rpx;
	}

	
	/* 搜索框 */
	.search-box {
		display: flex;
		align-items: center;
		background-color: #fff;
		border-radius: 30rpx;
		margin: -270rpx 30rpx;
		padding: 0 20rpx;
		height: 80rpx;
	}

	.search-box input {
		flex: 1;
		height: 100%;
		font-size: 28rpx;
	}

	.search-box image {
		width: 38rpx;
		height: 38rpx;
	}



	.intro1 {
		margin-top: 400rpx;
		padding: 40rpx 30rpx;
		background-color: white;
		width: 86%;
		height: 280rpx;
		margin-left: 20rpx;
		border-radius: 20rpx;
		

		
	}
	.intro2 {
		margin-top: 30rpx;
		padding: 40rpx 30rpx;
		background-color: white;
		width: 86%;
		height: 280rpx;
		margin-left: 20rpx;
		border-radius: 20rpx;
	
		
	}

	.hang1 {
		display: flex;
		justify-content: space-between;
	}

	.hang1 view:nth-child(1) {
		font-weight: bold;
		font-size: 35rpx;
	}

	.hang1 view:nth-child(2) {
		margin-top: 10rpx;
		font-weight: bold;
		font-size: 25rpx;
		color: skyblue;
	}
	
	.hang2{
		display: flex;
		font-size: 22rpx;
		padding-top: 15rpx;
	}
	.hang2 view:nth-child(3){
		padding-left: 50rpx;
	}
	.detail{
		padding: 20rpx 0;
		display: flex;
	}
	
	.detail image{
		width: 250rpx;
		height: 160rpx;
		border-radius: 20rpx;
	}
	.detail .right{
		font-size: 25rpx;
		line-height: 50rpx;
		padding: 15rpx 20rpx;
	}
	
	
	.more{
		margin-top: 50rpx;
		text-align: center;
		color: #a9a9a9;
	}
</style>